import React,{useEffect,useState} from 'react';
import {Outlet} from "react-router-dom";
import Slider from "../layout/Slider/Index";
import Header from "../layout/Header/Index";
import axios from "axios";
import {get} from "../service";
function Main(props) {
    const [meuns,setMeuns]=useState([])
    const onRequestMenus=()=>{
        get('/api/main/menuList').then((res)=>{
            setMeuns(res.records)
        })
    }
    useEffect(()=>{
       onRequestMenus()
        window.addEventListener('refreshMenus', ()=>{
            onRequestMenus()
        });
       return ()=>{
           window.removeEventListener('refreshMenus', ()=>{
                onRequestMenus()
           })
       }
    },[])
    return (
        <div className="app">
            <div className="m-slide">
                <Slider menus={meuns}/>
            </div>
            <div className="m-content">
                <Header/>
                <Outlet/>
            </div>
        </div>
    );
}

export default Main;
